Vue.component("aui-pagination", {
    template: `   
        <nav class="aui-pagination" :class="{'hide': pagination.pageCount < 1}">
           <div class="aui-layout aui-gutter-xs aui-inline-row">          
                <ul class="aui-layout__item pagination-sm" ref="page"></ul>                
                <div class="aui-layout__item">
                    总共：{{pagination.pageCount}}页{{pagination.totalCount}}条
                </div>
            </div>                                                                
        </nav>
    `,
    props: {
        visiblePages: {
            type: Number,
            default: 5
        }
    },
    data() {
        var ret = {};
        ret.pagination = {
            currentPage: 1,
            pageCount: 0,
            perPage: 10,
            totalCount: 0
        };
        return ret;
    },
    mounted(){
        var self = this;
        self.anuElement = {};
        self.anuElement.element = $(self.$refs.page);
        self.paginationObject = {};
    },
    methods: {
        setPagination(pagination) {
            var self = this;
            var lastpagination = self.pagination;
            var currentPage = self.anuElement.element.twbsPagination('getCurrentPage');
            self.anuElement.element.twbsPagination('destroy');
            if (pagination.pageCount > 0) {
                self.anuElement.element.twbsPagination({
                    startPage: currentPage,
                    totalPages: pagination.pageCount,
                    onPageClick: function (event, page) {
                        self.$emit("pageclick", page);
                    }
                });              
                self.paginationObject = self.anuElement.element.data('twbs-pagination');
            }
            self.pagination = pagination;
        }
    },
});